<template>
    <div>
        <header class="pr white" style="padding: 15px 0px 17px;">
            <img src="../../assets/images/7.jpg" class="displayB centerauto shadowB" style="max-width: 70%;margin: 0px auto;padding: 10px;background: #fff;" />
        </header>
        <div id="main_box_h">
            <van-list v-model="loading" :finished="finished" finished-text="没有更多了" :loading-text="loadText" @load="onLoad" style="background: #6BA2D8;">
                <van-cell-group style="background: transparent;">
                    <van-cell v-for="(item,index) in list" :key="index" :title="item.a_title" :value="item.a_update_time.substr(0,10)" is-link :to="'/notice/details/'+item.a_id" style="background: transparent;color: #fff;" />
                </van-cell-group>
            </van-list>
        </div>
        <img src="../../assets/images/zx_pic.png" width="100%" height="120" />
    </div>
</template>
<script>
    import '@/assets/css/main.css'
    export default {
        data(){
            return{
                list: [],
                loading: false,
                finished: false,
                loadText: '加载中…',
                page: 0,
                
            }
        },
        methods: {
            onLoad() {

                var _this = this;

                this.$httpGet('/api/index/Article/getArticleList',{'page': ++this.page}).then(response => {
                    
                    if(response.code == 200){

                        let re = response.msg.data;
                        if (re.length !== 0) {
                            //新增数据拼接在后面
                            this.list = this.list.concat(response.msg.data);
                        }
                    
                        // 加载状态结束
                        this.loading = false;

                        // 数据全部加载完成
                        if (this.list.length >= response.msg.total) {
                            this.finished = true;
                            this.loadText = "加载完成";
                        }

                    }else{
                        this.$toast(response.msg);
                    }

                });
            },
        },
        mounted(){
            document.title = '新闻资讯';
        },
        destroyed(){
            document.title = 'Dukascopy';
        },
    }
</script>
<style>
    #main_box_h{
        /* height: calc(100vh - 107px - 120px);
        overflow-y: scroll; */
    }
    #main_box_h .van-cell__value,#main_box_h .van-cell__right-icon,#main_box_h .van-list__error-text, #main_box_h .van-list__finished-text,#main_box_h .van-list__loading-text{
        color: #fff;
    }
</style>
